@CHARSET "UTF-8";

@media all and (max-width: 980px) {
	
#wrap {width:100%;}
#header {width:auto; }
}



@media all and (max-width: 800px) {
#wrap {width:100%;}
#header h1{margin-left: 10px; }
#header p{margin-left: 20px; margin-bottom: 0;}
#header .mainWeb{right: 250px; }
#header img{width: 240px; vertical-align: middle; }
#header .loginForm{ height: 150px;}
#header  .login{padding-left:4%; padding-top:5%; margin:auto;  width: 80%; height:auto; font-size: 14px;}
#header  .loginInput{margin:3% auto; width: 90%; font-size: 12px;}
#header .loginSubmit{margin-top: 7%;}

#menubar .menuLine{ font-size: 15px; margin-left: 4px; margin-top: 5px; width: 400px; -webkit-logical-width:417px;}
#menubar .search{ width: 320px; margin-right: 10px;}

}

@media all and (max-width: 740px) {
	#header img{width: 170px; margin-top: 20px; }
	#menubar .menuLine{width: 100%; margin: auto;}
	#menubar .menuLine ul {width:65%; margin: 0 auto;}
	#menubar .search{ display: none;}
	#content {width: auto; margin: 2px auto; float: none;}
	#right {display: none;}
}

@media all and (max-width: 600px) {
#wrap {width:100%;}	
#header {height: auto; }
#header .mainName{width: 220px; margin:auto; margin-top: 30px; padding-left: 80px;}
#header .mainName img{display: inline; width: 50px; margin-left: 7%;}
#header h1{text-align: center;font-size: 33px; margin-bottom: 10px; }
#header p{display: none;}


#header .menuName{display: block; float: left; position: absolute; bottom:25px; left: 5px; font-weight: bold; }
#header .loginName{display: block; float: left; position: absolute; top:68px; left: 5px; font-weight: bold; }
#header .home{display: block; float: left; position: absolute; top:25px; left: 5px; font-weight: bold; }
#header .home a{font-size: 20px;}
#header .menuName a{font-size: 20px;}
#header .loginName a{font-size: 20px;}

#header .mainWeb{left: 33%; bottom:10px; display: none;}
#header img{width: 150px; margin-top: 5px; margin-bottom: 5px; display: none; }
#header .span{width: 80%; margin: auto; }
#header  span a{ font-size: 13px; font-weight: bold; }
#header .loginForm {display: none; background: white; margin: auto; }
#header  .loginInput{width: 150px; font-size: 14px;}


/* #container {background: #41BBEB;} */
#menubar { width: 100%; height:100%; height: auto; }
#menubar .menuLine{display:none; margin: 0; padding: 0; width: 100%; left: 0; }
#menubar .menuLine ul {width: 100%;}
#menubar .menuLine ul li{display: block; margin-left: 5px; line-height: 2em; font-size: 18px; padding-left: 15px; }
#menubar .menuLine img{display: block; float: right; margin: 3px 15px 0 0;}
#menubar .menuLine .freeboard {display: block; float: right; margin: 3px 16px 0 0;}

#menubar .search{float:left; width: 100%; display: block;  }
#menubar .search .searchset {margin:0 auto; width: 330px;  }

/* memberForm */

#memberForm .table {font-size: 11px; width: auto;}
#memberForm .table .notice{font-size: 10px;}
#memberForm .table th{font-size: 12px; width: 100px;}
#memberForm img{width: 150px; }

/* menutab */
#siteMap td{font-size: 12px; font-weight: bold; line-height: 1.8em;}

}


@media all and (max-width: 312px) {

#menubar .search {font-size: 10px;}
#menubar .search .searchset {margin:0 auto; width: 300px;  }
#menubar .search select {width: 60px; margin-left: 10px; height: 22px; -webkit-logical-height: 25px; margin-bottom: 1px;}
#menubar .search .inputbox {width: 150px;  height: 20px; -webkit-logical-height: 25px; margin-top: 6px;}
#menubar .search .submit { text-align: center; line-height:22px; -webkit-logical-height: 25px; }
}












